<script setup>
import topBar from "../components/TopBar.vue";
import footerBar from "../components/FooterBar.vue";
import { onMounted, ref } from "vue";
import { signIpApi } from "../api/index.js";
import { useUserIdStore } from "../stores/user";
// 获取用户 IP 地址
const userIdStore = useUserIdStore();
const ip = ref("");
const fetchIp = async () => {
  try {
    const response = await signIpApi();
    ip.value = response.ip;
    // 将获取到的 IP 地址赋值给 pinia 里的 user 值
    userIdStore.getUser(ip.value);
  } catch (error) {
    console.error("获取IP地址时出错:", error);
  }
};
onMounted(() => {
  fetchIp();
})

</script>

<template>
  <div>
    <topBar />
  </div>
  <div class="main">
    <RouterView></RouterView>
  </div>
  <footerBar />
</template>

<style lang="less" scoped>
.main {
  width: 100%;
  margin-top: 52px;
  min-height: calc(100vh - 252px); // 减去顶部和底部的高度;
}
</style>
